<template>
  <!-- 地址回传 -->
  <div class="addressReturn">
    <el-table :data="tableData" border stripe>
      <el-table-column prop="obj_number" label="对象编号"></el-table-column>
      <el-table-column prop="obj_name" label="对象名称" show-overflow-tooltip></el-table-column>
      <el-table-column label="经纬度" show-overflow-tooltip width="150">
        <template slot-scope="scope">
          <!-- <p>{{toFixed2(scope.row.lng)}}，{{toFixed2(scope.row.lat)}}</p> -->
          <div>{{scope.row.lng}}</div>
          <div>{{scope.row.lat}}</div>
        </template>
      </el-table-column>
      <el-table-column prop="standard_address" label="标准地址" show-overflow-tooltip></el-table-column>
      <el-table-column prop="supplementary_address" label="补充地址"></el-table-column>
      <el-table-column prop="target_address" label="目标地址" show-overflow-tooltip>
        <template slot-scope="scope">
           <el-popover
            placement="top-start"
            :title="(scope.row.obj_number || '') + (scope.row.obj_name || '')"
            width="200"
            trigger="hover"
            >
            <div>详情：{{scope.row.details}}</div>
            <p slot="reference">{{scope.row.target_address}}</p>
          </el-popover>
        </template>
      </el-table-column>
      <el-table-column prop="source_address" label="原地址" show-overflow-tooltip></el-table-column>
      <el-table-column prop="details" label="详情" show-overflow-tooltip></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button type="text" size="small" @click="editAddressShowFunc(scope.row)">修改补充地址</el-button>
        </template>
      </el-table-column>
    </el-table>

    <addrEditMoreWin
      :visible="showAddressReturn"
      :onOk="() => closeDialog('showAddressReturn')"
      :confirmSubmit="(e) => addressReturnConfirm(e)"
      :editAddrFormData="editAddrFormData"
    ></addrEditMoreWin>

    <el-pagination
      class="pagination"
      small
      layout="prev, pager, next"
      :total="total_num"
      @current-change="pageChange"
    ></el-pagination>
  </div>
</template>

<script>
import addrEditMoreWin from "./addrPass/addrEditMoreWin";
import { addOperationLog } from "@/utils/index";

export default {
  components: {
    addrEditMoreWin,
  },
  data() {
    return {
      showAddressReturn: false,
      editAddrFormData: {},
      tableData: [],
      keyword: "",
      total_num: 0,
      currentPage: 1,
    };
  },
  mounted() {
    this.getList();
  },
  watch: {
    "$store.state.currentFileInfo": {
      deep: true,
      handler(val, oldval) {
        if (JSON.stringify(val) !== JSON.stringify(oldval)) {
          this.getList();
        }
      },
    },
  },
  methods: {
    async getList() {
      const res = await this.axios.post(this.apis.addressDataQuery, {
        import_file_record_id: this.$store.state.currentFileInfo.id,
        page: this.currentPage,
        limit: 10,
        // is_sure_standard_address: true
      });
      if (res.retCode === 2000) {
        this.tableData = res.rows.items;
        this.total_num = res.rows.total_num
      }
    },
    pageChange(e) {
      this.currentPage = e
      this.getList()
    },
    // toFixed2(val){
    //   return parseFloat(val).toFixed(2)
    // },
    editAddressShowFunc(row) {
      console.log("editAddressShowFunc");
      this.editAddrFormData = JSON.parse(JSON.stringify(row));
      this.showAddressReturn = true;
    },
    async addressReturnConfirm(e) {
      console.log(e, "econfirmSubmit");
      this.showAddressReturn = false;
      const res = await this.axios.post(this.apis.updateSupplementaryAddress, {
        id: e.id,
        supplementary_address: e.supplementary_address,
      });
      if (res.retCode === 2000) {
        this.$message.success("修改成功！");
        this.getList()
        await addOperationLog({
          title: "修改补充地址",
          content: {
            old_target_address: '',
            new_target_address: e.supplementary_address,
          },
        });
      }
    },
    closeDialog(dialogStr) {
      this[dialogStr] = false;
    },
  },
};
</script>

<style lang="less">
.addressReturn .el-table__header-wrapper .el-table__cell {
  padding: 5px 0;
  font-size: 12px;
}
.addressReturn .el-table__body-wrapper .el-table__cell {
  padding: 5px 0;
  font-size: 10px;
}

.addressReturn th.el-table__cell {
  background-color: rgba(245, 247, 250, 1);
}

.addressReturn {
  height: 100%;
  position: relative;
  .pagination {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
  }
  .el-pager li.active {
    background-color: #409eff;
    border-radius: 3px;
    color: #fff;
  }
  .el-pagination .btn-prev,
  .el-pagination .btn-next {
    padding: 0 4px !important;
  }
}
</style>